<%--
  Created by IntelliJ IDEA.
  User: 骆谦实
  Date: 2022/5/2
  Time: 9:40
  To change this template use File | Settings | File Templates.
--%>
    <%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="utf-8"%>
        <!DOCTYPE html>
        <html lang="zh">

        <head>
            <meta charset="UTF-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>信息收集表</title>
            <style>
                .mainTable {
                    margin-left: 40%;
                    text-align: center;
                    width: 400px;
                    height: 300px;
                }
                
                .title {
                    font-size: larger;
                    font-weight: 700;
                }
                
                .inputInfo {
                    width: 350px;
                    height: 30px;
                }
            </style>
        </head>

        <body>
            <form action="judge" method="post">
                <table class="mainTable" border="3">
                    <tr>
                        <td colspan="2">
                            <span class="title">信息收集表</span>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            <input type="text" value="请输入你的信息：" name="inputInfo" class="inputInfo" id="inputInfo">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="submit">
                        </td>
                        <td>
                            <input type="reset">
                        </td>
                    </tr>
                </table>
            </form>

            <!--实现输入框提示字符串灵活化的js-->
            <script>
                //在当前页面加载完的时候执行
                window.onload = function() {
                    //当获得焦点的时候，默认值消失;trim()用来清除字符串中的空格
                    inputInfo.onfocus = function() {
                            if (inputInfo.value.trim() == "请输入你的信息：") {
                                inputInfo.value = "";
                            }
                        }
                        //当失去焦点的时候，如果此时输入框中的内容为空，则默认值恢复
                    inputInfo.onblur = function() {
                        if (inputInfo.value.trim() == "") {
                            inputInfo.value = "请输入你的信息：";
                        }
                    }
                }
            </script>
        </body>

        </html>